<template>
  <view class="salary-list-container">
	  
    <uni-table border stripe emptyText="暂无更多数据" >
    	<!-- 表头行 -->
    	<uni-tr>
    		<uni-th align="center">年月</uni-th>
    		<uni-th align="center">姓名</uni-th>
    		<uni-th align="left">薪资</uni-th>
    		<uni-th align="left">状态</uni-th>
    		<uni-th align="left">操作</uni-th>
    	</uni-tr>
    	<!-- 表格数据行 -->
    	<uni-tr v-for="item in tableData">
    		<uni-td>{{item.salaryMonth}}</uni-td>
    		<uni-td>{{item.talentName}}</uni-td>
    		<uni-td>{{item.payableSalary}}</uni-td>
			<uni-td>{{item.empConfirm == '0'?'未确认':'已确认'}}</uni-td>
			<uni-td ><text class="operate" @click="handleView(item)">查看</text></uni-td>
    	</uni-tr>
   
    
    </uni-table>

  </view>
</template>

<script>
import {salaryPage,salaryConfirm} from '@/api/xinziqingkuang/xinziqingkuang.js'
import Loading from '@/components/loading/loading.vue'
export default {
	components:{Loading},
  data() {
    return {
		status:'loadmore',
		upx2px:uni.upx2px(400),
		queryParams:{
			pageNum:1,
			pageSize:10
		},
      tableData: [
        // { salaryMonth: '2025-02', talentName: '张小刚', payableSalary: 5000, empConfirm: '0' },
        // { salaryMonth: '2025-01', talentName: '张小刚', payableSalary: 5000, empConfirm: '1' },
        // { salaryMonth: '2024-12', talentName: '张小刚', payableSalary: 5000, empConfirm: '1' },
        // { salaryMonth: '2024-11', talentName: '张小刚', payableSalary: 5000, empConfirm: '1' },
        // { salaryMonth: '2024-10', talentName: '张小刚', payableSalary: 5000, empConfirm: '1' },
        // { salaryMonth: '2024-09', talentName: '张小刚', payableSalary: 5000, empConfirm: '1' },
        // { salaryMonth: '2024-08', talentName: '张小刚', payableSalary: 5000, empConfirm: '1' },
        // { salaryMonth: '2024-07', talentName: '张小刚', payableSalary: 5000, empConfirm: '1' },
        // { salaryMonth: '2024-06', talentName: '张小刚', payableSalary: 5000, empConfirm: '1' },
        // { salaryMonth: '2024-05', talentName: '张小刚', payableSalary: 5000, empConfirm: '1' }
      ]
    };
  },
  mounted(){
	this.salaryPage(this.queryParams) 
  },
  methods: {
	  async salaryPage(data){
		let res = await salaryPage(data);  
		console.log(res,"薪资列表")
		if(res.code == 200){
			this.tableData = res.rows
		}
	  },
	  async salaryConfirm(){
	  	let res = await salaryConfirm();
	  	console.log(res)
	  },
	  loadMore () {
	  	if(this.status == "nomore")return
	  	console.log('底部触发')
	  	this.status = 'loading'
	  	this.queryParams.pageNum += 1
	  	this.messageList(this.queryParams)
	  },
    handleView(item) {
      // 点击“查看”的逻辑，比如跳转详情页等，这里可根据实际需求完善
      console.log('查看', item);
      // 示例： uni.navigateTo({ url: `/pages/detail/detail?data=${JSON.stringify(item)}` });
	  //'/pages/tuiJianGangWei/tuiJianGangWei/tuiJianGangWei?renCaiInfo='+encodeURIComponent(JSON.stringify(this.resumeObject))
	  uni.navigateTo({
	  	url: '/pages/salary-details/salary-details?detailsInfo='+encodeURIComponent(JSON.stringify(item))
	  })
    },
	
  },
};
</script>

<style scoped>
.salary-list-container {
  padding: 10px;
}
.table-header,
.table-body {
  display: flex;
  flex-direction: row;
  border: 1px solid #ccc;
  margin-bottom: -1px; /* 解决边框重叠问题 */
}
.header-item,
.body-item {
  flex: 1;
  text-align: center;
  padding: 8px 0;
  border-right: 1px solid #ccc;
}
.header-item:last-child,
.body-item:last-child {
  border-right: none;
}
.operate {
  color: #007aff; /* 模拟链接颜色，可根据设计调整 */
}
</style>